<template>
  <div>
    <h2>Publish</h2>
    <button @click="handleClick()">发送测试事件</button>
    <input v-model="value">
    <h2>Subscribe</h2>
    <ul>
      <li v-for="event in eventsReceived" :key="event">{{event}}</li>
    </ul>
  </div>
</template>
<script>
  export default{
    props: ['ds'],
    data() {
      return {
        eventsReceived: [],
        value: ''
      }
    },
    created() {
      this.event = this.ds.event
      this.event.subscribe('test-event', value => {
        this.eventsReceived.push(value)
      })
    },
    methods: {
      handleClick() {
        this.event.emit('test-event', this.value)
      }
    }
  }
</script>
